<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<%@ include file="/include/head-master.jsp"%>

<link rel="stylesheet" type="text/css" href="plugins/bootstrap/css/bootstrap-glyphicons.css">
<link rel="stylesheet" type="text/css" href="css/search-result.css">
<link rel="stylesheet" type="text/css" href="css/manage-seat.css">
<link rel="stylesheet" type="text/css" href="css/seat-map.css">
<script src="js/seat-map.js" type="text/javascript"></script>

<title>Search</title>
</head>
<body>

	<div class="container">
		<%@ include file="/include/header.jsp"%>
<%-- 		  <div class="row">
                <div class="col-md-6">
                	&nbsp;
                </div>
                <div class="col-md-6">
                    <div class="well">
                    	<%@ include file="/include/searchbar.jsp"%>
                    </div>
                </div>
            </div> --%>
            
            <div class="row">
            	<!-- <div id="resources" class="col-md-2"> -->
            	<div class="col-md-2">
            		<!-- <ul class="list-group"> -->
            			<%@ include file="/include/searchresult.jsp"%>
            		<!-- </ul>  -->
            	</div>
            	<div class="col-md-10">
 					<!-- <div id="seat-map-view" class="well">-->
 						<%@ include file="/include/seat-map-view.jsp"%>
 					<!-- </div> -->
 				</div> 
			</div>
        </div>
        
		<%@ include file="/include/footer.jsp"%>
		
		<c:forEach items="${employeeSeats }" var="empSeat">
		<div class="employee-seat">
			<input type="hidden" value="${empSeat.seat.col}-${empSeat.seat.row}" class="coordinate" /> 
			<input type="hidden" value="${empSeat.employee.firstName }"	class="first-name" /> 
				<input type="hidden" value="${empSeat.employee.lastName }" class="last-name" />
				<input type="hidden" value="${empSeat.seat.seatCode }" class="seat-code" />
				<input type="hidden" value="${empSeat.seat.localNo }" class="local-no" />
				<input type="hidden" value="${empSeat.seat.project.projectCode }" class="project-code" />
		</div>
		</c:forEach>

</body>

<script type="text/javascript">
	function clickHref(hrefId) {		
		var seatId=hrefId.replace("liId",""); 
		$("div[id^='"+ seatId +"']").css({'border-color' : '#FF00FF', 'border-width' : '2px'}); 
		
		$('#' + seatId).popover('show');
		
		var quadrant = $('#' + seatId).parent().parent().parent();
		
	};
</script>

</html>